<template>
  <div>
    <el-row style="margin-bottom:20px;display:flex;justify-content:flex-start">
      <searchperson @getpersonid="getpersonid"></searchperson>
      <el-date-picker
        clearable
        v-model="plandate2"
        type="daterange"
        style="margin-left:10px"
        rangeSeparator="至"
        startPlaceholder="培训开始日期"
        endPlaceholder="培训开始日期"
        valueFormat="yyyy-MM-dd"
      ></el-date-picker>
      <el-button size="mini" type="primary" @click="getperlist3">搜索</el-button>
    </el-row>
    <pertable3 :tableData="pertable3" :pagobj.sync="pagobj" v-if="isworktable3" :ischeck="false"></pertable3>

  </div>
</template>

<script>
import searchperson from '~/components/common/searchperson.vue';
import pertable3 from '~/components/person/performance3/pertable3.vue';

export default {
  data() {
    return {
      ts: this.newStore(),
      isworktable3: true,
      pagesize: 0,
      currentPage: 0,
      pagobj: {
        currentPage3: 1,
        pagesize: 100,
        total: 10,
      },
      pertable3: [],
      plandate2: [],
      pid: '',
    };
  },
  created() {
    this.getperlist3();
  },
  components: {
    searchperson,
    pertable3,
  },
  methods: {
    // 获取列表
    getperlist3() {
      // console.log("2222");
      const req = {
        handle:
          '33224548EFC2E94F5D1CB0CAB6CFDFF273936C62493B31D1F6486B1D96ED9F7E',
        pid: this.pid,
        grantime_begin: this.plandate2[0],
        grantime_end: this.plandate2[1],
        start: (this.pagobj.currentPage3 - 1) * this.pagobj.pagesize,
        limit: this.pagobj.pagesize,
      };
      this.spost(this.ts, '/mainservlet', req).then((ts) => {
        this.pertable3 = ts.d.data.operation1;
        this.isworktable3 = false;
        this.$nextTick(() => {
          this.isworktable3 = true;
        });
        this.pagobj.total = parseInt(ts.d.data.operation2[0].hash.allrs);
      });
    },
    // 获取姓名
    getpersonid(val) {
      this.pid = val.id;
    },
  },
};
</script>
